<template>
	<view class="container container336462">
		<diy-navbar :isFixed="true" backUrl="/pages/index" bgColor="gradual-blue" :isHome="true" :isBack="true">
			<!-- #ifndef VUE3 -->
			<block slot="backText"> 返回 </block>
			<block slot="content"> 活动管理 </block>
			<!-- #endif -->
			<!-- #ifdef VUE3 -->
			<template v-slot:backText> 返回 </template>
			<template v-slot:content> 活动管理 </template>
			<!-- #endif -->
		</diy-navbar>
		<view class="flex diygw-autoview diygw-col-24 flex-direction-column autoview-clz">
			<!-- #ifdef MP-WEIXIN -->
			<view class="diygw-absolute autoview_0">
				<view class="flex diygw-col-18 search-clz">
					<view class="diygw-search">
						<view class="flex1 align-center flex padding-xs solid radius">
							<text class="diy-icon-search" style="color: "></text>
							<input class="flex1" name="search" type="" v-model="search" placeholder="请输入关键字" />
						</view>
						<view @tap="navigateTo" data-type="searchListFunction" style="color: #333 !important" class="diygw-tag margin-left-xs radius-xs"> 搜索 </view>
					</view>
				</view>
			</view>
			<!--  #endif -->
		</view>
		<view class="flex diygw-col-24">
			<view class="diygw-pzx" style="border-bottom: 1rpx solid #8e8d8d;"></view>
		</view>
		<view class="flex flex-wrap diygw-col-24 items-center">
			<view class="flex diygw-dropdown diygw-col-21">
				<diy-dropdown class="flex-sub" direction="" ref="refDropdowns">
					<diy-dropdown-item @change="changeDropdowns0" v-model="dropdowns0" title="商品来源" :options="dropdownsDatas0"></diy-dropdown-item>
					<diy-dropdown-item @change="changeDropdowns1" v-model="dropdowns1" title="商品分类" :options="dropdownsDatas1"></diy-dropdown-item>
					<diy-dropdown-item @change="changeDropdowns2" v-model="dropdowns2" title="时间" :options="dropdownsDatas2"></diy-dropdown-item>
				</diy-dropdown>
			</view>
			<image src="/static/filter.png" class="response diygw-col-5 image-clz" mode="widthFix"></image>
		</view>
		
		<view class="flex flex-wrap diygw-col-24 flex-direction-column flex2-clz">
			<view class="flex flex-wrap diygw-col-24 justify-between items-center flex1-clz">
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 活动名称： </text>
					<text class="diygw-col-0 text1-clz"> 免费领取鸡蛋 </text>
				</view>
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 活动类型： </text>
					<text class="diygw-col-0"> 免费 </text>
				</view>
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 活动时间： </text>
					<text class="diygw-col-0"> 2025-03-14 08:00 - 2025-03-14 18:00 </text>
				</view>
				<view class="flex flex-wrap diygw-col-0 items-center"> </view>
			</view>
			<view class="flex flex-wrap diygw-col-24 justify-between items-center flex4-clz">
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 活动店面： </text>
					<text class="diygw-col-0"> 店面1；店面2；店面3 </text>
				</view>
			</view>
			<view class="flex diygw-col-24 line-clz">
				<view class="diygw-pzx" style="border-bottom: 1px solid #eee"></view>
			</view>
			<view class="flex flex-wrap diygw-col-0 justify-end items-center flex6-clz">
				<text class="diygw-col-0 red text3-clz"> 删除 </text>
				<text class="diygw-col-0 blue text8-clz"> 编辑 </text>
				<text class="diygw-col-0 blue text2-clz"> 查看详情 </text>
			</view>
		</view>
		<view class="flex flex-wrap diygw-col-24 flex-direction-column flex7-clz">
			<view class="flex flex-wrap diygw-col-24 justify-between items-center flex8-clz">
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 活动名称： </text>
					<text class="diygw-col-0 text11-clz"> XXX商品5折促销 </text>
				</view>
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 活动类型： </text>
					<text class="diygw-col-0"> 会员福利 </text>
				</view>
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 价格： </text>
					<text class="diygw-col-0"> 100 </text>
				</view>
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 折扣价格： </text>
					<text class="diygw-col-0"> 50 </text>
				</view>
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 活动时间： </text>
					<text class="diygw-col-0"> 2025-03-14 10:00 - 2025-03-14 14:00 </text>
				</view>
				<view class="flex flex-wrap diygw-col-0 items-center"> </view>
			</view>
			<view class="flex flex-wrap diygw-col-24 justify-between items-center flex13-clz">
				<view class="flex flex-wrap diygw-col-0 items-center">
					<text class="diygw-col-0"> 活动店面： </text>
					<text class="diygw-col-0"> 店面1；店面2；店面3 </text>
				</view>
			</view>
			<view class="flex diygw-col-24 line1-clz">
				<view class="diygw-pzx" style="border-bottom: 1px solid #eee"></view>
			</view>
			<view class="flex flex-wrap diygw-col-0 justify-end items-center flex15-clz">
				<text class="diygw-col-0 red text18-clz"> 删除 </text>
				<text class="diygw-col-0 blue text19-clz"> 编辑 </text>
				<text class="diygw-col-0 blue text20-clz"> 查看详情 </text>
			</view>
		</view>
        <view class="flex diygw-col-24 diygw-bottom">
			<view class="diygw-grid diygw-actions">
				<button @tap="navigateTo" data-type="page" data-url="/pages/index" class="diygw-action">
					<view class="diygw-grid-inner">
						<view class="diygw-grid-icon diygw-avatar" style="">
							<image mode="aspectFit" class="diygw-avatar-img" src="/static/global/grid1.png"></image>
						</view>
						<view class="diygw-grid-title"> 首页 </view>
					</view>
				</button>
				<button @tap="navigateTo" data-type="page" data-url="/pages/goods/list" class="diygw-action">
					<view class="diygw-grid-inner">
						<view class="diygw-grid-icon diygw-avatar" style="">
							<image mode="aspectFit" class="diygw-avatar-img" src="/static/goods.png"></image>
						</view>
						<view class="diygw-grid-title"> 商品库存 </view>
					</view>
				</button>
				<button @tap="navigateTo" data-type="page" data-url="/pages/order/list" class="diygw-action">
					<view class="diygw-grid-inner">
						<view class="diygw-grid-icon diygw-avatar" style="">
							<image mode="aspectFit" class="diygw-avatar-img" src="/static/all_order.png"></image>
						</view>
						<view class="diygw-grid-title"> 会员订单 </view>
					</view>
				</button>
				<button @tap="navigateTo" data-type="page" data-url="/pages/stroeActive/list" class="diygw-action">
					<view class="diygw-grid-inner">
						<view class="diygw-grid-icon diygw-avatar" style="">
							<image mode="aspectFit" class="diygw-avatar-img" src="/static/global/grid2.png"></image>
						</view>
						<view class="diygw-grid-title"> 门店活动 </view>
					</view>
				</button>
				<button class="diygw-action">
					<view class="diygw-grid-inner">
						<view class="diygw-grid-icon diygw-avatar" style="">
							<image mode="aspectFit" class="diygw-avatar-img" src="/static/me.png"></image>
						</view>
						<view class="diygw-grid-title"> 我的 </view>
					</view>
				</button>
			</view>
		</view>
		<view class="clearfix"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				//用户全局信息
				userInfo: {},
				//页面传参
				globalOption: {},
				//自定义全局变量
				globalData: {},
				search: ''
			};
		},
		onShow() {
			this.setCurrentPage(this);
		},
		onLoad(option) {
			this.setCurrentPage(this);
			if (option) {
				this.setData({
					globalOption: this.getOption(option)
				});
			}

			this.init();
		},
		methods: {
			async init() {}
		}
	};
</script>

<style lang="scss" scoped>
	.autoview-clz {
		z-index: 1000;
		height: 106rpx;
	}

	.autoview_0 {
		left: 8rpx;
		top: 6rpx;
		width: 100%;
		height: 92rpx;
		z-index: 0;
	}
	.autoview_0 > .flex {
		height: 100%;
	}
	.autoview_1 {
		left: 634rpx;
		top: 14rpx;
		width: 58rpx;
		height: 64rpx;
		z-index: 0;
	}
	.autoview_1 > .flex {
		height: 100%;
	}
	.search-clz {
		border-right: 2rpx solid #716f6f;
	}
	.flex2-clz {
		border-bottom: 10rpx solid #d6d6d6;
	}
	.flex1-clz {
		margin-left: 10rpx;
		width: calc(100% - 10rpx - 10rpx) !important;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		margin-right: 10rpx;
		line-height: 55rpx;
	}
	.text1-clz {
		color: #0059ff;
	}
	.flex4-clz {
		margin-left: 10rpx;
		width: calc(100% - 10rpx - 10rpx) !important;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		margin-right: 10rpx;
	}
	.line-clz {
		margin-left: 10rpx;
		width: calc(100% - 10rpx - 10rpx) !important;
		margin-top: 0rpx;
		margin-bottom: 0rpx;
		margin-right: 10rpx;
	}
	.flex6-clz {
		margin-left: 10rpx;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		margin-right: 10rpx;
	}
	.text3-clz {
		padding-top: 10rpx;
		border-bottom-left-radius: 24rpx;
		padding-left: 30rpx;
		padding-bottom: 10rpx;
		border-top-right-radius: 24rpx;
		margin-right: 10rpx;
		margin-left: 10rpx;
		overflow: hidden;
		border-top-left-radius: 24rpx;
		margin-top: 10rpx;
		border-bottom-right-radius: 24rpx;
		margin-bottom: 10rpx;
		padding-right: 30rpx;
	}
	.text8-clz {
		padding-top: 10rpx;
		border-bottom-left-radius: 24rpx;
		padding-left: 30rpx;
		padding-bottom: 10rpx;
		border-top-right-radius: 24rpx;
		margin-right: 10rpx;
		margin-left: 10rpx;
		overflow: hidden;
		border-top-left-radius: 24rpx;
		margin-top: 10rpx;
		border-bottom-right-radius: 24rpx;
		margin-bottom: 10rpx;
		padding-right: 30rpx;
	}
	.text2-clz {
		padding-top: 10rpx;
		border-bottom-left-radius: 24rpx;
		padding-left: 30rpx;
		padding-bottom: 10rpx;
		border-top-right-radius: 24rpx;
		margin-right: 10rpx;
		margin-left: 10rpx;
		overflow: hidden;
		border-top-left-radius: 24rpx;
		margin-top: 10rpx;
		border-bottom-right-radius: 24rpx;
		margin-bottom: 10rpx;
		padding-right: 30rpx;
	}
	.flex7-clz {
		border-bottom: 10rpx solid #d6d6d6;
	}
	.flex8-clz {
		margin-left: 10rpx;
		width: calc(100% - 10rpx - 10rpx) !important;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		margin-right: 10rpx;
	}
	.text11-clz {
		color: #0059ff;
	}
	.flex13-clz {
		margin-left: 10rpx;
		width: calc(100% - 10rpx - 10rpx) !important;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		margin-right: 10rpx;
	}
	.line1-clz {
		margin-left: 10rpx;
		width: calc(100% - 10rpx - 10rpx) !important;
		margin-top: 0rpx;
		margin-bottom: 0rpx;
		margin-right: 10rpx;
	}
	.flex15-clz {
		margin-left: 10rpx;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		margin-right: 10rpx;
	}
	.text18-clz {
		padding-top: 10rpx;
		border-bottom-left-radius: 24rpx;
		padding-left: 30rpx;
		padding-bottom: 10rpx;
		border-top-right-radius: 24rpx;
		margin-right: 10rpx;
		margin-left: 10rpx;
		overflow: hidden;
		border-top-left-radius: 24rpx;
		margin-top: 10rpx;
		border-bottom-right-radius: 24rpx;
		margin-bottom: 10rpx;
		padding-right: 30rpx;
	}
	.text19-clz {
		padding-top: 10rpx;
		border-bottom-left-radius: 24rpx;
		padding-left: 30rpx;
		padding-bottom: 10rpx;
		border-top-right-radius: 24rpx;
		margin-right: 10rpx;
		margin-left: 10rpx;
		overflow: hidden;
		border-top-left-radius: 24rpx;
		margin-top: 10rpx;
		border-bottom-right-radius: 24rpx;
		margin-bottom: 10rpx;
		padding-right: 30rpx;
	}
	.text20-clz {
		padding-top: 10rpx;
		border-bottom-left-radius: 24rpx;
		padding-left: 30rpx;
		padding-bottom: 10rpx;
		border-top-right-radius: 24rpx;
		margin-right: 10rpx;
		margin-left: 10rpx;
		overflow: hidden;
		border-top-left-radius: 24rpx;
		margin-top: 10rpx;
		border-bottom-right-radius: 24rpx;
		margin-bottom: 10rpx;
		padding-right: 30rpx;
	}
	.container336462 {
		padding-bottom: 80px;
	}
	
	.image-clz {
		flex-shrink: 0;
		width: 60rpx !important;
	}
</style>
